import { observable, action, computed } from 'mobx';
import { message } from 'antd';
import * as API from '../../apis/performance/gpReportListApi'
import { WeaLocaleProvider } from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

/**
 * 绩效-考核执行分析-按组织
 * jiansong 2019/7/3
 */
export default class GpReportListStore {

    @observable loading = true; //加载中
    @observable year = ''; //年份
    @observable month = ''; //月份
    @observable tableDataList = []; //表格数据值
    @observable yearDatas = []; //年份数组
    @observable selectedRowKeys = []; //选中的行
    @observable selectedRowValues = []; //选中的行值
    @observable showCharts = false; //是否显示图表
    @observable titlename = ''; //展示名称
    chartOption = {}; //图表配置

    @action("初始化操作")
    doInit = () => {
        this.showCharts = false;
        this.selectedRowKeys = [];
        this.selectedRowValues = [];

        this.initYearAndData();
        this.getGpReportListData();
    };

    @observable monthData = [
        getLabel(25825, '1月'),
        getLabel(25826, '2月'),
        getLabel(25827, '3月'),
        getLabel(25828, '4月'),
        getLabel(25829, '5月'),
        getLabel(25830, '6月'),
        getLabel(25831, '7月'),
        getLabel(25832, '8月'),
        getLabel(25833, '9月'),
        getLabel(25834, '10月'),
        getLabel(25835, '11月'),
        getLabel(25836, '12月'),
    ]

    @action('选中行改变')
    onSelectChange = (selectedRowKeys, selectedRowValues) => {
        this.selectedRowKeys = selectedRowKeys;
        this.selectedRowValues = selectedRowValues;
    }

    @action('查看图表')
    showChart = () => {
        //若选中行只有一行，则显示饼图，否则显示柱状图
        if (this.selectedRowValues.length > 1) {
            this.chartOption = {
                toolbox: {
                    feature: {
                        magicType: { show: true, type: ['line', 'bar'] },
                    },
                    y: 10,
                    x: '90%'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#999'
                        }
                    }
                },
                legend: {
                    data: this.selectedRowValues.map((item) => item.showname)
                },
                xAxis: {
                    data: [
                        getLabel('508846', '有方案'),
                        getLabel('508779', '无方案'),
                        getLabel('508847', '考核评分中'),
                        getLabel('508848', '考核审批中'),
                        getLabel('508849', '考核退回'),
                        getLabel('23774', '已完成'),
                        getLabel('508851', '过期评分中'),
                        getLabel('508852', '过期审批中'),
                        getLabel('508853', '过期退回')
                    ],
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                yAxis: {},
                series: this.getSeries()
            }
        } else if (this.selectedRowValues.length == 1) {
            let data = this.selectedRowValues[0];
            this.chartOption = {
                tooltip: {
                    trigger: 'item',
                    formatter: "{a} <br/>{b}: {c} ({d}%)"
                },
                title: {
                    text: data.showname + getLabel('508854', '考核执行统计'),
                    x: 'center'
                },
                legend: {
                    orient: 'vertical',
                    x: 'left',
                    data: [
                        getLabel('508846', '有方案'),
                        getLabel('508779', '无方案'),
                        getLabel('508847', '考核评分中'),
                        getLabel('508848', '考核审批中'),
                        getLabel('508849', '考核退回'),
                        getLabel('23774', '已完成'),
                        getLabel('508851', '过期评分中'),
                        getLabel('508852', '过期审批中'),
                        getLabel('508853', '过期退回')
                    ],
                },
                series: [
                    {
                        name: data.showname,
                        type: 'pie',
                        selectedMode: 'single',
                        radius: '75%',
                        center: ['50%', '50%'],
                        label: {
                            normal: {
                                position: 'inner'
                            }
                        },
                        labelLine: {
                            normal: {
                                show: false
                            }
                        },
                        data: [
                            { value: data.exist, name: getLabel('508846', '有方案') },
                            { value: data.without, name: getLabel('508779', '无方案') },
                            { value: data.scoring, name: getLabel('508847', '考核评分中') },
                            { value: data.assessing, name: getLabel('508848', '考核审批中') },
                            { value: data.back, name: getLabel('508849', '考核退回') },
                            { value: data.finish, name: getLabel('23774', '已完成') },
                            { value: data.oscoring, name: getLabel('508851', '过期评分中') },
                            { value: data.oassessing, name: getLabel('508852', '过期审批中') },
                            { value: data.oback, name: getLabel('508853', '过期退回') },
                        ]
                    }
                ]
            }
        }
        this.changeShowCharts();
    }

    //获取图表内容
    getSeries() {
        let series = [];
        this.selectedRowValues.map(item => {
            series.push(
                {
                    name: item.showname,
                    type: 'bar',
                    data: [item.exist, item.without, item.scoring, item.assessing, item.back, item.finish, item.oscoring, item.oassessing, item.oback]
                }
            )
        })
        return series;
    }

    @action('图表状态改变')
    changeShowCharts = () => {
        this.showCharts = !this.showCharts;
    }

    //初始化年份和月份数据
    initYearAndData() {
        let date = new Date();
        let fullYear = date.getFullYear();
        let ydatas = [];
        for (let i = parseInt(fullYear)+1; i > 2012; i--) {
            ydatas.push({ key: i, showname: i });
        }
        this.yearDatas = ydatas;
        if (date.getMonth() == 0) {
            this.year = fullYear - 1;
            this.month = 12;
        } else {
            this.year = fullYear;
            this.month = date.getMonth();
        }
    };

    @action("获取组织考核分析")
    getGpReportListData = () => {
        this.selectedRowKeys = [];
        this.selectedRowValues = [];
        let params = {
            year: this.year,
            month: this.month,
        }
        this.loading = true;
        API.gpReportListApi(params).then(res => {
            if (res.api_status) {
                this.tableDataList = res.datas
                this.titlename = res.titlename
            } else {
                message.error(res.msg || getLabel('508818', '接口调用失败！'))
            }
            this.loading = false;
        });
    };


}
